<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8"/>
  <title>IconFont Demo</title>
  <link rel="shortcut icon" href="https://img.alicdn.com/tps/i4/TB1_oz6GVXXXXaFXpXXJDFnIXXX-64-64.ico" type="image/x-icon"/>
  <link rel="stylesheet" href="https://g.alicdn.com/thx/cube/1.3.2/cube.min.css">
  <link rel="stylesheet" href="demo.css">
  <link rel="stylesheet" href="iconfont.css">
  <script src="iconfont.js"></script>
  <!-- jQuery -->
  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/7bfddb60-08e8-11e9-9b04-53e73bb6408b.js"></script>
  <!-- 代码高亮 -->
  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/a3f714d0-08e6-11e9-8a15-ebf944d7534c.js"></script>
</head>
<body>
  <div class="main">
    <h1 class="logo"><a href="https://www.iconfont.cn/" title="iconfont 首页" target="_blank">&#xe86b;</a></h1>
    <div class="nav-tabs">
      <ul id="tabs" class="dib-box">
        <li class="dib active"><span>Unicode</span></li>
        <li class="dib"><span>Font class</span></li>
        <li class="dib"><span>Symbol</span></li>
      </ul>
      
      <a href="https://www.iconfont.cn/manage/index?manage_type=myprojects&projectId=1954669" target="_blank" class="nav-more">查看项目</a>
      
    </div>
    <div class="tab-container">
      <div class="content unicode" style="display: block;">
          <ul class="icon_lists dib-box">
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe643;</span>
                <div class="name">图标双色</div>
                <div class="code-name">&amp;#xe643;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe644;</span>
                <div class="name">图标双色</div>
                <div class="code-name">&amp;#xe644;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe646;</span>
                <div class="name">图标双色</div>
                <div class="code-name">&amp;#xe646;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe647;</span>
                <div class="name">图标双色</div>
                <div class="code-name">&amp;#xe647;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe648;</span>
                <div class="name">图标双色</div>
                <div class="code-name">&amp;#xe648;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe649;</span>
                <div class="name">图标双色</div>
                <div class="code-name">&amp;#xe649;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe64a;</span>
                <div class="name">图标双色</div>
                <div class="code-name">&amp;#xe64a;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe64b;</span>
                <div class="name">图标双色</div>
                <div class="code-name">&amp;#xe64b;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe64c;</span>
                <div class="name">图标双色 (2)</div>
                <div class="code-name">&amp;#xe64c;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe64d;</span>
                <div class="name">首页双色</div>
                <div class="code-name">&amp;#xe64d;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe64f;</span>
                <div class="name">首页双色</div>
                <div class="code-name">&amp;#xe64f;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe6c2;</span>
                <div class="name">首页双色</div>
                <div class="code-name">&amp;#xe6c2;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe641;</span>
                <div class="name">方案</div>
                <div class="code-name">&amp;#xe641;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe650;</span>
                <div class="name">方案 (3)</div>
                <div class="code-name">&amp;#xe650;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe651;</span>
                <div class="name">方案 (1)</div>
                <div class="code-name">&amp;#xe651;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe652;</span>
                <div class="name">方案 (2)</div>
                <div class="code-name">&amp;#xe652;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe653;</span>
                <div class="name">方案 (5)</div>
                <div class="code-name">&amp;#xe653;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe654;</span>
                <div class="name">方案 (6)</div>
                <div class="code-name">&amp;#xe654;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe655;</span>
                <div class="name">方案 (4)</div>
                <div class="code-name">&amp;#xe655;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe656;</span>
                <div class="name">方案 (9)</div>
                <div class="code-name">&amp;#xe656;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe657;</span>
                <div class="name">方案 (8)</div>
                <div class="code-name">&amp;#xe657;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe658;</span>
                <div class="name">方案 (7)</div>
                <div class="code-name">&amp;#xe658;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe659;</span>
                <div class="name">方案 (12)</div>
                <div class="code-name">&amp;#xe659;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe65a;</span>
                <div class="name">方案 (11)</div>
                <div class="code-name">&amp;#xe65a;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe673;</span>
                <div class="name">方案 (15)</div>
                <div class="code-name">&amp;#xe673;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe65b;</span>
                <div class="name">方案 (10)</div>
                <div class="code-name">&amp;#xe65b;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe65c;</span>
                <div class="name">方案 (14)</div>
                <div class="code-name">&amp;#xe65c;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe65d;</span>
                <div class="name">方案 (13)</div>
                <div class="code-name">&amp;#xe65d;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe65e;</span>
                <div class="name">方案 (16)</div>
                <div class="code-name">&amp;#xe65e;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe660;</span>
                <div class="name">方案 (18)</div>
                <div class="code-name">&amp;#xe660;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe661;</span>
                <div class="name">方案 (17)</div>
                <div class="code-name">&amp;#xe661;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe662;</span>
                <div class="name">方案 (19)</div>
                <div class="code-name">&amp;#xe662;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe663;</span>
                <div class="name">方案 (20)</div>
                <div class="code-name">&amp;#xe663;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe664;</span>
                <div class="name">方案 (21)</div>
                <div class="code-name">&amp;#xe664;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe665;</span>
                <div class="name">方案 (22)</div>
                <div class="code-name">&amp;#xe665;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe666;</span>
                <div class="name">方案 (24)</div>
                <div class="code-name">&amp;#xe666;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe667;</span>
                <div class="name">方案 (23)</div>
                <div class="code-name">&amp;#xe667;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe668;</span>
                <div class="name">方案 (27)</div>
                <div class="code-name">&amp;#xe668;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe669;</span>
                <div class="name">方案 (26)</div>
                <div class="code-name">&amp;#xe669;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe66a;</span>
                <div class="name">方案 (25)</div>
                <div class="code-name">&amp;#xe66a;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe66b;</span>
                <div class="name">方案 (30)</div>
                <div class="code-name">&amp;#xe66b;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe66c;</span>
                <div class="name">方案 (28)</div>
                <div class="code-name">&amp;#xe66c;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe66d;</span>
                <div class="name">方案 (33)</div>
                <div class="code-name">&amp;#xe66d;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe66e;</span>
                <div class="name">方案 (31)</div>
                <div class="code-name">&amp;#xe66e;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe66f;</span>
                <div class="name">方案 (32)</div>
                <div class="code-name">&amp;#xe66f;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe670;</span>
                <div class="name">方案 (34)</div>
                <div class="code-name">&amp;#xe670;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe671;</span>
                <div class="name">方案 (35)</div>
                <div class="code-name">&amp;#xe671;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe672;</span>
                <div class="name">方案 (36)</div>
                <div class="code-name">&amp;#xe672;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe674;</span>
                <div class="name">方案 (39)</div>
                <div class="code-name">&amp;#xe674;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe675;</span>
                <div class="name">方案 (37)</div>
                <div class="code-name">&amp;#xe675;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe676;</span>
                <div class="name">方案 (38)</div>
                <div class="code-name">&amp;#xe676;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe677;</span>
                <div class="name">方案 (40)</div>
                <div class="code-name">&amp;#xe677;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe678;</span>
                <div class="name">方案 (41)</div>
                <div class="code-name">&amp;#xe678;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe679;</span>
                <div class="name">方案 (42)</div>
                <div class="code-name">&amp;#xe679;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe67a;</span>
                <div class="name">方案 (45)</div>
                <div class="code-name">&amp;#xe67a;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe67b;</span>
                <div class="name">方案 (46)</div>
                <div class="code-name">&amp;#xe67b;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe67c;</span>
                <div class="name">方案 (44)</div>
                <div class="code-name">&amp;#xe67c;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe67d;</span>
                <div class="name">方案 (43)</div>
                <div class="code-name">&amp;#xe67d;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe67e;</span>
                <div class="name">方案 (48)</div>
                <div class="code-name">&amp;#xe67e;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe67f;</span>
                <div class="name">方案 (47)</div>
                <div class="code-name">&amp;#xe67f;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe680;</span>
                <div class="name">方案 (49)</div>
                <div class="code-name">&amp;#xe680;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe681;</span>
                <div class="name">方案 (51)</div>
                <div class="code-name">&amp;#xe681;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe682;</span>
                <div class="name">方案 (52)</div>
                <div class="code-name">&amp;#xe682;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe683;</span>
                <div class="name">方案 (53)</div>
                <div class="code-name">&amp;#xe683;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe684;</span>
                <div class="name">方案 (50)</div>
                <div class="code-name">&amp;#xe684;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe685;</span>
                <div class="name">方案 (54)</div>
                <div class="code-name">&amp;#xe685;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe686;</span>
                <div class="name">方案 (55)</div>
                <div class="code-name">&amp;#xe686;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe687;</span>
                <div class="name">方案 (57)</div>
                <div class="code-name">&amp;#xe687;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe688;</span>
                <div class="name">方案 (60)</div>
                <div class="code-name">&amp;#xe688;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe689;</span>
                <div class="name">方案 (56)</div>
                <div class="code-name">&amp;#xe689;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe68a;</span>
                <div class="name">方案 (61)</div>
                <div class="code-name">&amp;#xe68a;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe68b;</span>
                <div class="name">方案 (58)</div>
                <div class="code-name">&amp;#xe68b;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe68c;</span>
                <div class="name">方案 (59)</div>
                <div class="code-name">&amp;#xe68c;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe68d;</span>
                <div class="name">方案 (62)</div>
                <div class="code-name">&amp;#xe68d;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe68e;</span>
                <div class="name">方案 (63)</div>
                <div class="code-name">&amp;#xe68e;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe68f;</span>
                <div class="name">方案 (66)</div>
                <div class="code-name">&amp;#xe68f;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe690;</span>
                <div class="name">方案 (65)</div>
                <div class="code-name">&amp;#xe690;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe691;</span>
                <div class="name">方案 (70)</div>
                <div class="code-name">&amp;#xe691;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe692;</span>
                <div class="name">方案 (67)</div>
                <div class="code-name">&amp;#xe692;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe693;</span>
                <div class="name">方案 (69)</div>
                <div class="code-name">&amp;#xe693;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe694;</span>
                <div class="name">方案 (64)</div>
                <div class="code-name">&amp;#xe694;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe695;</span>
                <div class="name">方案 (68)</div>
                <div class="code-name">&amp;#xe695;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe6bb;</span>
                <div class="name">方案 (72)</div>
                <div class="code-name">&amp;#xe6bb;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe696;</span>
                <div class="name">方案 (71)</div>
                <div class="code-name">&amp;#xe696;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe697;</span>
                <div class="name">方案 (75)</div>
                <div class="code-name">&amp;#xe697;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe698;</span>
                <div class="name">方案 (76)</div>
                <div class="code-name">&amp;#xe698;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe699;</span>
                <div class="name">方案 (73)</div>
                <div class="code-name">&amp;#xe699;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe69a;</span>
                <div class="name">方案 (74)</div>
                <div class="code-name">&amp;#xe69a;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe69b;</span>
                <div class="name">方案 (78)</div>
                <div class="code-name">&amp;#xe69b;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe69c;</span>
                <div class="name">方案 (79)</div>
                <div class="code-name">&amp;#xe69c;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe69d;</span>
                <div class="name">方案 (77)</div>
                <div class="code-name">&amp;#xe69d;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe69e;</span>
                <div class="name">方案 (81)</div>
                <div class="code-name">&amp;#xe69e;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe69f;</span>
                <div class="name">方案 (84)</div>
                <div class="code-name">&amp;#xe69f;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe6a0;</span>
                <div class="name">方案 (82)</div>
                <div class="code-name">&amp;#xe6a0;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe6bc;</span>
                <div class="name">方案 (85)</div>
                <div class="code-name">&amp;#xe6bc;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe6a1;</span>
                <div class="name">方案 (80)</div>
                <div class="code-name">&amp;#xe6a1;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe6a2;</span>
                <div class="name">方案 (87)</div>
                <div class="code-name">&amp;#xe6a2;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe6a3;</span>
                <div class="name">方案 (90)</div>
                <div class="code-name">&amp;#xe6a3;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe6a4;</span>
                <div class="name">方案 (86)</div>
                <div class="code-name">&amp;#xe6a4;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe6a5;</span>
                <div class="name">方案 (89)</div>
                <div class="code-name">&amp;#xe6a5;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe6a6;</span>
                <div class="name">方案 (88)</div>
                <div class="code-name">&amp;#xe6a6;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe6a7;</span>
                <div class="name">方案 (91)</div>
                <div class="code-name">&amp;#xe6a7;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe6a8;</span>
                <div class="name">方案 (96)</div>
                <div class="code-name">&amp;#xe6a8;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe6a9;</span>
                <div class="name">方案 (95)</div>
                <div class="code-name">&amp;#xe6a9;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe6aa;</span>
                <div class="name">方案 (93)</div>
                <div class="code-name">&amp;#xe6aa;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe6ab;</span>
                <div class="name">方案 (94)</div>
                <div class="code-name">&amp;#xe6ab;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe6ac;</span>
                <div class="name">方案 (99)</div>
                <div class="code-name">&amp;#xe6ac;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe6ad;</span>
                <div class="name">方案 (92)</div>
                <div class="code-name">&amp;#xe6ad;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe6ae;</span>
                <div class="name">方案 (97)</div>
                <div class="code-name">&amp;#xe6ae;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe6af;</span>
                <div class="name">方案 (83)</div>
                <div class="code-name">&amp;#xe6af;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe6b0;</span>
                <div class="name">方案 (98)</div>
                <div class="code-name">&amp;#xe6b0;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe6b1;</span>
                <div class="name">方案 (100)</div>
                <div class="code-name">&amp;#xe6b1;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe6b2;</span>
                <div class="name">方案 (102)</div>
                <div class="code-name">&amp;#xe6b2;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe6b3;</span>
                <div class="name">方案 (105)</div>
                <div class="code-name">&amp;#xe6b3;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe6b4;</span>
                <div class="name">方案 (106)</div>
                <div class="code-name">&amp;#xe6b4;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe6b5;</span>
                <div class="name">方案 (101)</div>
                <div class="code-name">&amp;#xe6b5;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe6b6;</span>
                <div class="name">方案 (104)</div>
                <div class="code-name">&amp;#xe6b6;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe6b7;</span>
                <div class="name">方案 (103)</div>
                <div class="code-name">&amp;#xe6b7;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe6b8;</span>
                <div class="name">方案106</div>
                <div class="code-name">&amp;#xe6b8;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe6bd;</span>
                <div class="name">方案107</div>
                <div class="code-name">&amp;#xe6bd;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe6be;</span>
                <div class="name">方案105</div>
                <div class="code-name">&amp;#xe6be;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe6b9;</span>
                <div class="name">方案108</div>
                <div class="code-name">&amp;#xe6b9;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe6ba;</span>
                <div class="name">方案109</div>
                <div class="code-name">&amp;#xe6ba;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe645;</span>
                <div class="name">微信双色</div>
                <div class="code-name">&amp;#xe645;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe6c3;</span>
                <div class="name">名片双色</div>
                <div class="code-name">&amp;#xe6c3;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe6bf;</span>
                <div class="name">调研方案</div>
                <div class="code-name">&amp;#xe6bf;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe64e;</span>
                <div class="name">方案 (18)</div>
                <div class="code-name">&amp;#xe64e;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe6c1;</span>
                <div class="name">解决方案</div>
                <div class="code-name">&amp;#xe6c1;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe6ea;</span>
                <div class="name">TencentDB for DBbrain_数据库优化_智能运维 - 腾讯云</div>
                <div class="code-name">&amp;#xe6ea;</div>
              </li>
          
            <li class="dib">
              <span class="icon linear-iconfont">&#xe6c0;</span>
                <div class="name">方案</div>
                <div class="code-name">&amp;#xe6c0;</div>
              </li>
          
          </ul>
          <div class="article markdown">
          <h2 id="unicode-">Unicode 引用</h2>
          <hr>

          <p>Unicode 是字体在网页端最原始的应用方式，特点是：</p>
          <ul>
            <li>兼容性最好，支持 IE6+，及所有现代浏览器。</li>
            <li>支持按字体的方式去动态调整图标大小，颜色等等。</li>
            <li>但是因为是字体，所以不支持多色。只能使用平台里单色的图标，就算项目里有多色图标也会自动去色。</li>
          </ul>
          <blockquote>
            <p>注意：新版 iconfont 支持多色图标，这些多色图标在 Unicode 模式下将不能使用，如果有需求建议使用symbol 的引用方式</p>
          </blockquote>
          <p>Unicode 使用步骤如下：</p>
          <h3 id="-font-face">第一步：拷贝项目下面生成的 <code>@font-face</code></h3>
<pre><code class="language-css"
>@font-face {
  font-family: 'linear-iconfont';
  src: url('iconfont.eot');
  src: url('iconfont.eot?#iefix') format('embedded-opentype'),
      url('iconfont.woff2') format('woff2'),
      url('iconfont.woff') format('woff'),
      url('iconfont.ttf') format('truetype'),
      url('iconfont.svg#linear-iconfont') format('svg');
}
</code></pre>
          <h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
<pre><code class="language-css"
>.linear-iconfont {
  font-family: "linear-iconfont" !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
</code></pre>
          <h3 id="-">第三步：挑选相应图标并获取字体编码，应用于页面</h3>
<pre>
<code class="language-html"
>&lt;span class="linear-iconfont"&gt;&amp;#x33;&lt;/span&gt;
</code></pre>
          <blockquote>
            <p>"linear-iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
          </blockquote>
          </div>
      </div>
      <div class="content font-class">
        <ul class="icon_lists dib-box">
          
          <li class="dib">
            <span class="icon linear-iconfont linear-tubiaoshuangse"></span>
            <div class="name">
              图标双色
            </div>
            <div class="code-name">.linear-tubiaoshuangse
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-tubiaoshuangse1"></span>
            <div class="name">
              图标双色
            </div>
            <div class="code-name">.linear-tubiaoshuangse1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-tubiaoshuangse2"></span>
            <div class="name">
              图标双色
            </div>
            <div class="code-name">.linear-tubiaoshuangse2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-tubiaoshuangse3"></span>
            <div class="name">
              图标双色
            </div>
            <div class="code-name">.linear-tubiaoshuangse3
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-tubiaoshuangse4"></span>
            <div class="name">
              图标双色
            </div>
            <div class="code-name">.linear-tubiaoshuangse4
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-tubiaoshuangse5"></span>
            <div class="name">
              图标双色
            </div>
            <div class="code-name">.linear-tubiaoshuangse5
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-tubiaoshuangse6"></span>
            <div class="name">
              图标双色
            </div>
            <div class="code-name">.linear-tubiaoshuangse6
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-tubiaoshuangse7"></span>
            <div class="name">
              图标双色
            </div>
            <div class="code-name">.linear-tubiaoshuangse7
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-tubiaoshuangse8"></span>
            <div class="name">
              图标双色 (2)
            </div>
            <div class="code-name">.linear-tubiaoshuangse8
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-shouyeshuangse"></span>
            <div class="name">
              首页双色
            </div>
            <div class="code-name">.linear-shouyeshuangse
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-shouyeshuangse1"></span>
            <div class="name">
              首页双色
            </div>
            <div class="code-name">.linear-shouyeshuangse1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-shouyeshuangse2"></span>
            <div class="name">
              首页双色
            </div>
            <div class="code-name">.linear-shouyeshuangse2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan"></span>
            <div class="name">
              方案
            </div>
            <div class="code-name">.linear-fangan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan1"></span>
            <div class="name">
              方案 (3)
            </div>
            <div class="code-name">.linear-fangan1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan2"></span>
            <div class="name">
              方案 (1)
            </div>
            <div class="code-name">.linear-fangan2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan3"></span>
            <div class="name">
              方案 (2)
            </div>
            <div class="code-name">.linear-fangan3
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan4"></span>
            <div class="name">
              方案 (5)
            </div>
            <div class="code-name">.linear-fangan4
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan5"></span>
            <div class="name">
              方案 (6)
            </div>
            <div class="code-name">.linear-fangan5
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan6"></span>
            <div class="name">
              方案 (4)
            </div>
            <div class="code-name">.linear-fangan6
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan7"></span>
            <div class="name">
              方案 (9)
            </div>
            <div class="code-name">.linear-fangan7
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan8"></span>
            <div class="name">
              方案 (8)
            </div>
            <div class="code-name">.linear-fangan8
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan9"></span>
            <div class="name">
              方案 (7)
            </div>
            <div class="code-name">.linear-fangan9
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan10"></span>
            <div class="name">
              方案 (12)
            </div>
            <div class="code-name">.linear-fangan10
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan11"></span>
            <div class="name">
              方案 (11)
            </div>
            <div class="code-name">.linear-fangan11
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan106"></span>
            <div class="name">
              方案 (15)
            </div>
            <div class="code-name">.linear-fangan106
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan12"></span>
            <div class="name">
              方案 (10)
            </div>
            <div class="code-name">.linear-fangan12
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan13"></span>
            <div class="name">
              方案 (14)
            </div>
            <div class="code-name">.linear-fangan13
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan14"></span>
            <div class="name">
              方案 (13)
            </div>
            <div class="code-name">.linear-fangan14
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan15"></span>
            <div class="name">
              方案 (16)
            </div>
            <div class="code-name">.linear-fangan15
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan16"></span>
            <div class="name">
              方案 (18)
            </div>
            <div class="code-name">.linear-fangan16
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan17"></span>
            <div class="name">
              方案 (17)
            </div>
            <div class="code-name">.linear-fangan17
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan18"></span>
            <div class="name">
              方案 (19)
            </div>
            <div class="code-name">.linear-fangan18
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan19"></span>
            <div class="name">
              方案 (20)
            </div>
            <div class="code-name">.linear-fangan19
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan20"></span>
            <div class="name">
              方案 (21)
            </div>
            <div class="code-name">.linear-fangan20
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan21"></span>
            <div class="name">
              方案 (22)
            </div>
            <div class="code-name">.linear-fangan21
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan22"></span>
            <div class="name">
              方案 (24)
            </div>
            <div class="code-name">.linear-fangan22
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan23"></span>
            <div class="name">
              方案 (23)
            </div>
            <div class="code-name">.linear-fangan23
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan24"></span>
            <div class="name">
              方案 (27)
            </div>
            <div class="code-name">.linear-fangan24
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan25"></span>
            <div class="name">
              方案 (26)
            </div>
            <div class="code-name">.linear-fangan25
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan26"></span>
            <div class="name">
              方案 (25)
            </div>
            <div class="code-name">.linear-fangan26
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan27"></span>
            <div class="name">
              方案 (30)
            </div>
            <div class="code-name">.linear-fangan27
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan28"></span>
            <div class="name">
              方案 (28)
            </div>
            <div class="code-name">.linear-fangan28
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan29"></span>
            <div class="name">
              方案 (33)
            </div>
            <div class="code-name">.linear-fangan29
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan30"></span>
            <div class="name">
              方案 (31)
            </div>
            <div class="code-name">.linear-fangan30
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan31"></span>
            <div class="name">
              方案 (32)
            </div>
            <div class="code-name">.linear-fangan31
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan32"></span>
            <div class="name">
              方案 (34)
            </div>
            <div class="code-name">.linear-fangan32
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan33"></span>
            <div class="name">
              方案 (35)
            </div>
            <div class="code-name">.linear-fangan33
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan34"></span>
            <div class="name">
              方案 (36)
            </div>
            <div class="code-name">.linear-fangan34
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan35"></span>
            <div class="name">
              方案 (39)
            </div>
            <div class="code-name">.linear-fangan35
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan36"></span>
            <div class="name">
              方案 (37)
            </div>
            <div class="code-name">.linear-fangan36
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan37"></span>
            <div class="name">
              方案 (38)
            </div>
            <div class="code-name">.linear-fangan37
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan38"></span>
            <div class="name">
              方案 (40)
            </div>
            <div class="code-name">.linear-fangan38
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan39"></span>
            <div class="name">
              方案 (41)
            </div>
            <div class="code-name">.linear-fangan39
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan40"></span>
            <div class="name">
              方案 (42)
            </div>
            <div class="code-name">.linear-fangan40
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan41"></span>
            <div class="name">
              方案 (45)
            </div>
            <div class="code-name">.linear-fangan41
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan42"></span>
            <div class="name">
              方案 (46)
            </div>
            <div class="code-name">.linear-fangan42
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan43"></span>
            <div class="name">
              方案 (44)
            </div>
            <div class="code-name">.linear-fangan43
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan44"></span>
            <div class="name">
              方案 (43)
            </div>
            <div class="code-name">.linear-fangan44
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan45"></span>
            <div class="name">
              方案 (48)
            </div>
            <div class="code-name">.linear-fangan45
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan46"></span>
            <div class="name">
              方案 (47)
            </div>
            <div class="code-name">.linear-fangan46
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan47"></span>
            <div class="name">
              方案 (49)
            </div>
            <div class="code-name">.linear-fangan47
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan48"></span>
            <div class="name">
              方案 (51)
            </div>
            <div class="code-name">.linear-fangan48
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan49"></span>
            <div class="name">
              方案 (52)
            </div>
            <div class="code-name">.linear-fangan49
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan50"></span>
            <div class="name">
              方案 (53)
            </div>
            <div class="code-name">.linear-fangan50
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan51"></span>
            <div class="name">
              方案 (50)
            </div>
            <div class="code-name">.linear-fangan51
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan52"></span>
            <div class="name">
              方案 (54)
            </div>
            <div class="code-name">.linear-fangan52
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan53"></span>
            <div class="name">
              方案 (55)
            </div>
            <div class="code-name">.linear-fangan53
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan54"></span>
            <div class="name">
              方案 (57)
            </div>
            <div class="code-name">.linear-fangan54
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan55"></span>
            <div class="name">
              方案 (60)
            </div>
            <div class="code-name">.linear-fangan55
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan56"></span>
            <div class="name">
              方案 (56)
            </div>
            <div class="code-name">.linear-fangan56
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan57"></span>
            <div class="name">
              方案 (61)
            </div>
            <div class="code-name">.linear-fangan57
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan58"></span>
            <div class="name">
              方案 (58)
            </div>
            <div class="code-name">.linear-fangan58
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan59"></span>
            <div class="name">
              方案 (59)
            </div>
            <div class="code-name">.linear-fangan59
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan60"></span>
            <div class="name">
              方案 (62)
            </div>
            <div class="code-name">.linear-fangan60
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan61"></span>
            <div class="name">
              方案 (63)
            </div>
            <div class="code-name">.linear-fangan61
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan62"></span>
            <div class="name">
              方案 (66)
            </div>
            <div class="code-name">.linear-fangan62
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan63"></span>
            <div class="name">
              方案 (65)
            </div>
            <div class="code-name">.linear-fangan63
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan64"></span>
            <div class="name">
              方案 (70)
            </div>
            <div class="code-name">.linear-fangan64
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan65"></span>
            <div class="name">
              方案 (67)
            </div>
            <div class="code-name">.linear-fangan65
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan66"></span>
            <div class="name">
              方案 (69)
            </div>
            <div class="code-name">.linear-fangan66
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan67"></span>
            <div class="name">
              方案 (64)
            </div>
            <div class="code-name">.linear-fangan67
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan68"></span>
            <div class="name">
              方案 (68)
            </div>
            <div class="code-name">.linear-fangan68
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan107"></span>
            <div class="name">
              方案 (72)
            </div>
            <div class="code-name">.linear-fangan107
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan69"></span>
            <div class="name">
              方案 (71)
            </div>
            <div class="code-name">.linear-fangan69
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan70"></span>
            <div class="name">
              方案 (75)
            </div>
            <div class="code-name">.linear-fangan70
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan71"></span>
            <div class="name">
              方案 (76)
            </div>
            <div class="code-name">.linear-fangan71
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan72"></span>
            <div class="name">
              方案 (73)
            </div>
            <div class="code-name">.linear-fangan72
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan73"></span>
            <div class="name">
              方案 (74)
            </div>
            <div class="code-name">.linear-fangan73
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan74"></span>
            <div class="name">
              方案 (78)
            </div>
            <div class="code-name">.linear-fangan74
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan75"></span>
            <div class="name">
              方案 (79)
            </div>
            <div class="code-name">.linear-fangan75
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan76"></span>
            <div class="name">
              方案 (77)
            </div>
            <div class="code-name">.linear-fangan76
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan77"></span>
            <div class="name">
              方案 (81)
            </div>
            <div class="code-name">.linear-fangan77
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan78"></span>
            <div class="name">
              方案 (84)
            </div>
            <div class="code-name">.linear-fangan78
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan79"></span>
            <div class="name">
              方案 (82)
            </div>
            <div class="code-name">.linear-fangan79
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan108"></span>
            <div class="name">
              方案 (85)
            </div>
            <div class="code-name">.linear-fangan108
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan80"></span>
            <div class="name">
              方案 (80)
            </div>
            <div class="code-name">.linear-fangan80
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan81"></span>
            <div class="name">
              方案 (87)
            </div>
            <div class="code-name">.linear-fangan81
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan82"></span>
            <div class="name">
              方案 (90)
            </div>
            <div class="code-name">.linear-fangan82
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan83"></span>
            <div class="name">
              方案 (86)
            </div>
            <div class="code-name">.linear-fangan83
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan84"></span>
            <div class="name">
              方案 (89)
            </div>
            <div class="code-name">.linear-fangan84
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan85"></span>
            <div class="name">
              方案 (88)
            </div>
            <div class="code-name">.linear-fangan85
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan86"></span>
            <div class="name">
              方案 (91)
            </div>
            <div class="code-name">.linear-fangan86
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan87"></span>
            <div class="name">
              方案 (96)
            </div>
            <div class="code-name">.linear-fangan87
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan88"></span>
            <div class="name">
              方案 (95)
            </div>
            <div class="code-name">.linear-fangan88
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan89"></span>
            <div class="name">
              方案 (93)
            </div>
            <div class="code-name">.linear-fangan89
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan90"></span>
            <div class="name">
              方案 (94)
            </div>
            <div class="code-name">.linear-fangan90
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan91"></span>
            <div class="name">
              方案 (99)
            </div>
            <div class="code-name">.linear-fangan91
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan92"></span>
            <div class="name">
              方案 (92)
            </div>
            <div class="code-name">.linear-fangan92
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan93"></span>
            <div class="name">
              方案 (97)
            </div>
            <div class="code-name">.linear-fangan93
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan94"></span>
            <div class="name">
              方案 (83)
            </div>
            <div class="code-name">.linear-fangan94
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan95"></span>
            <div class="name">
              方案 (98)
            </div>
            <div class="code-name">.linear-fangan95
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan96"></span>
            <div class="name">
              方案 (100)
            </div>
            <div class="code-name">.linear-fangan96
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan97"></span>
            <div class="name">
              方案 (102)
            </div>
            <div class="code-name">.linear-fangan97
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan98"></span>
            <div class="name">
              方案 (105)
            </div>
            <div class="code-name">.linear-fangan98
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan99"></span>
            <div class="name">
              方案 (106)
            </div>
            <div class="code-name">.linear-fangan99
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan100"></span>
            <div class="name">
              方案 (101)
            </div>
            <div class="code-name">.linear-fangan100
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan101"></span>
            <div class="name">
              方案 (104)
            </div>
            <div class="code-name">.linear-fangan101
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan102"></span>
            <div class="name">
              方案 (103)
            </div>
            <div class="code-name">.linear-fangan102
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan103"></span>
            <div class="name">
              方案106
            </div>
            <div class="code-name">.linear-fangan103
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan109"></span>
            <div class="name">
              方案107
            </div>
            <div class="code-name">.linear-fangan109
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan112"></span>
            <div class="name">
              方案105
            </div>
            <div class="code-name">.linear-fangan112
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan104"></span>
            <div class="name">
              方案108
            </div>
            <div class="code-name">.linear-fangan104
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan105"></span>
            <div class="name">
              方案109
            </div>
            <div class="code-name">.linear-fangan105
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-weixinshuangse"></span>
            <div class="name">
              微信双色
            </div>
            <div class="code-name">.linear-weixinshuangse
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-mingpianshuangse"></span>
            <div class="name">
              名片双色
            </div>
            <div class="code-name">.linear-mingpianshuangse
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-tiaoyanfangan"></span>
            <div class="name">
              调研方案
            </div>
            <div class="code-name">.linear-tiaoyanfangan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan110"></span>
            <div class="name">
              方案 (18)
            </div>
            <div class="code-name">.linear-fangan110
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-jiejuefangan"></span>
            <div class="name">
              解决方案
            </div>
            <div class="code-name">.linear-jiejuefangan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-ai"></span>
            <div class="name">
              TencentDB for DBbrain_数据库优化_智能运维 - 腾讯云
            </div>
            <div class="code-name">.linear-ai
            </div>
          </li>
          
          <li class="dib">
            <span class="icon linear-iconfont linear-fangan111"></span>
            <div class="name">
              方案
            </div>
            <div class="code-name">.linear-fangan111
            </div>
          </li>
          
        </ul>
        <div class="article markdown">
        <h2 id="font-class-">font-class 引用</h2>
        <hr>

        <p>font-class 是 Unicode 使用方式的一种变种，主要是解决 Unicode 书写不直观，语意不明确的问题。</p>
        <p>与 Unicode 使用方式相比，具有如下特点：</p>
        <ul>
          <li>兼容性良好，支持 IE8+，及所有现代浏览器。</li>
          <li>相比于 Unicode 语意明确，书写更直观。可以很容易分辨这个 icon 是什么。</li>
          <li>因为使用 class 来定义图标，所以当要替换图标时，只需要修改 class 里面的 Unicode 引用。</li>
          <li>不过因为本质上还是使用的字体，所以多色图标还是不支持的。</li>
        </ul>
        <p>使用步骤如下：</p>
        <h3 id="-fontclass-">第一步：引入项目下面生成的 fontclass 代码：</h3>
<pre><code class="language-html">&lt;link rel="stylesheet" href="./iconfont.css"&gt;
</code></pre>
        <h3 id="-">第二步：挑选相应图标并获取类名，应用于页面：</h3>
<pre><code class="language-html">&lt;span class="linear-iconfont linear-xxx"&gt;&lt;/span&gt;
</code></pre>
        <blockquote>
          <p>"
            linear-iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
        </blockquote>
      </div>
      </div>
      <div class="content symbol">
          <ul class="icon_lists dib-box">
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-tubiaoshuangse"></use>
                </svg>
                <div class="name">图标双色</div>
                <div class="code-name">#linear-tubiaoshuangse</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-tubiaoshuangse1"></use>
                </svg>
                <div class="name">图标双色</div>
                <div class="code-name">#linear-tubiaoshuangse1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-tubiaoshuangse2"></use>
                </svg>
                <div class="name">图标双色</div>
                <div class="code-name">#linear-tubiaoshuangse2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-tubiaoshuangse3"></use>
                </svg>
                <div class="name">图标双色</div>
                <div class="code-name">#linear-tubiaoshuangse3</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-tubiaoshuangse4"></use>
                </svg>
                <div class="name">图标双色</div>
                <div class="code-name">#linear-tubiaoshuangse4</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-tubiaoshuangse5"></use>
                </svg>
                <div class="name">图标双色</div>
                <div class="code-name">#linear-tubiaoshuangse5</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-tubiaoshuangse6"></use>
                </svg>
                <div class="name">图标双色</div>
                <div class="code-name">#linear-tubiaoshuangse6</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-tubiaoshuangse7"></use>
                </svg>
                <div class="name">图标双色</div>
                <div class="code-name">#linear-tubiaoshuangse7</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-tubiaoshuangse8"></use>
                </svg>
                <div class="name">图标双色 (2)</div>
                <div class="code-name">#linear-tubiaoshuangse8</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-shouyeshuangse"></use>
                </svg>
                <div class="name">首页双色</div>
                <div class="code-name">#linear-shouyeshuangse</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-shouyeshuangse1"></use>
                </svg>
                <div class="name">首页双色</div>
                <div class="code-name">#linear-shouyeshuangse1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-shouyeshuangse2"></use>
                </svg>
                <div class="name">首页双色</div>
                <div class="code-name">#linear-shouyeshuangse2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan"></use>
                </svg>
                <div class="name">方案</div>
                <div class="code-name">#linear-fangan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan1"></use>
                </svg>
                <div class="name">方案 (3)</div>
                <div class="code-name">#linear-fangan1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan2"></use>
                </svg>
                <div class="name">方案 (1)</div>
                <div class="code-name">#linear-fangan2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan3"></use>
                </svg>
                <div class="name">方案 (2)</div>
                <div class="code-name">#linear-fangan3</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan4"></use>
                </svg>
                <div class="name">方案 (5)</div>
                <div class="code-name">#linear-fangan4</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan5"></use>
                </svg>
                <div class="name">方案 (6)</div>
                <div class="code-name">#linear-fangan5</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan6"></use>
                </svg>
                <div class="name">方案 (4)</div>
                <div class="code-name">#linear-fangan6</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan7"></use>
                </svg>
                <div class="name">方案 (9)</div>
                <div class="code-name">#linear-fangan7</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan8"></use>
                </svg>
                <div class="name">方案 (8)</div>
                <div class="code-name">#linear-fangan8</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan9"></use>
                </svg>
                <div class="name">方案 (7)</div>
                <div class="code-name">#linear-fangan9</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan10"></use>
                </svg>
                <div class="name">方案 (12)</div>
                <div class="code-name">#linear-fangan10</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan11"></use>
                </svg>
                <div class="name">方案 (11)</div>
                <div class="code-name">#linear-fangan11</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan106"></use>
                </svg>
                <div class="name">方案 (15)</div>
                <div class="code-name">#linear-fangan106</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan12"></use>
                </svg>
                <div class="name">方案 (10)</div>
                <div class="code-name">#linear-fangan12</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan13"></use>
                </svg>
                <div class="name">方案 (14)</div>
                <div class="code-name">#linear-fangan13</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan14"></use>
                </svg>
                <div class="name">方案 (13)</div>
                <div class="code-name">#linear-fangan14</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan15"></use>
                </svg>
                <div class="name">方案 (16)</div>
                <div class="code-name">#linear-fangan15</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan16"></use>
                </svg>
                <div class="name">方案 (18)</div>
                <div class="code-name">#linear-fangan16</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan17"></use>
                </svg>
                <div class="name">方案 (17)</div>
                <div class="code-name">#linear-fangan17</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan18"></use>
                </svg>
                <div class="name">方案 (19)</div>
                <div class="code-name">#linear-fangan18</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan19"></use>
                </svg>
                <div class="name">方案 (20)</div>
                <div class="code-name">#linear-fangan19</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan20"></use>
                </svg>
                <div class="name">方案 (21)</div>
                <div class="code-name">#linear-fangan20</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan21"></use>
                </svg>
                <div class="name">方案 (22)</div>
                <div class="code-name">#linear-fangan21</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan22"></use>
                </svg>
                <div class="name">方案 (24)</div>
                <div class="code-name">#linear-fangan22</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan23"></use>
                </svg>
                <div class="name">方案 (23)</div>
                <div class="code-name">#linear-fangan23</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan24"></use>
                </svg>
                <div class="name">方案 (27)</div>
                <div class="code-name">#linear-fangan24</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan25"></use>
                </svg>
                <div class="name">方案 (26)</div>
                <div class="code-name">#linear-fangan25</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan26"></use>
                </svg>
                <div class="name">方案 (25)</div>
                <div class="code-name">#linear-fangan26</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan27"></use>
                </svg>
                <div class="name">方案 (30)</div>
                <div class="code-name">#linear-fangan27</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan28"></use>
                </svg>
                <div class="name">方案 (28)</div>
                <div class="code-name">#linear-fangan28</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan29"></use>
                </svg>
                <div class="name">方案 (33)</div>
                <div class="code-name">#linear-fangan29</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan30"></use>
                </svg>
                <div class="name">方案 (31)</div>
                <div class="code-name">#linear-fangan30</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan31"></use>
                </svg>
                <div class="name">方案 (32)</div>
                <div class="code-name">#linear-fangan31</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan32"></use>
                </svg>
                <div class="name">方案 (34)</div>
                <div class="code-name">#linear-fangan32</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan33"></use>
                </svg>
                <div class="name">方案 (35)</div>
                <div class="code-name">#linear-fangan33</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan34"></use>
                </svg>
                <div class="name">方案 (36)</div>
                <div class="code-name">#linear-fangan34</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan35"></use>
                </svg>
                <div class="name">方案 (39)</div>
                <div class="code-name">#linear-fangan35</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan36"></use>
                </svg>
                <div class="name">方案 (37)</div>
                <div class="code-name">#linear-fangan36</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan37"></use>
                </svg>
                <div class="name">方案 (38)</div>
                <div class="code-name">#linear-fangan37</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan38"></use>
                </svg>
                <div class="name">方案 (40)</div>
                <div class="code-name">#linear-fangan38</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan39"></use>
                </svg>
                <div class="name">方案 (41)</div>
                <div class="code-name">#linear-fangan39</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan40"></use>
                </svg>
                <div class="name">方案 (42)</div>
                <div class="code-name">#linear-fangan40</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan41"></use>
                </svg>
                <div class="name">方案 (45)</div>
                <div class="code-name">#linear-fangan41</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan42"></use>
                </svg>
                <div class="name">方案 (46)</div>
                <div class="code-name">#linear-fangan42</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan43"></use>
                </svg>
                <div class="name">方案 (44)</div>
                <div class="code-name">#linear-fangan43</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan44"></use>
                </svg>
                <div class="name">方案 (43)</div>
                <div class="code-name">#linear-fangan44</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan45"></use>
                </svg>
                <div class="name">方案 (48)</div>
                <div class="code-name">#linear-fangan45</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan46"></use>
                </svg>
                <div class="name">方案 (47)</div>
                <div class="code-name">#linear-fangan46</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan47"></use>
                </svg>
                <div class="name">方案 (49)</div>
                <div class="code-name">#linear-fangan47</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan48"></use>
                </svg>
                <div class="name">方案 (51)</div>
                <div class="code-name">#linear-fangan48</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan49"></use>
                </svg>
                <div class="name">方案 (52)</div>
                <div class="code-name">#linear-fangan49</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan50"></use>
                </svg>
                <div class="name">方案 (53)</div>
                <div class="code-name">#linear-fangan50</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan51"></use>
                </svg>
                <div class="name">方案 (50)</div>
                <div class="code-name">#linear-fangan51</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan52"></use>
                </svg>
                <div class="name">方案 (54)</div>
                <div class="code-name">#linear-fangan52</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan53"></use>
                </svg>
                <div class="name">方案 (55)</div>
                <div class="code-name">#linear-fangan53</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan54"></use>
                </svg>
                <div class="name">方案 (57)</div>
                <div class="code-name">#linear-fangan54</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan55"></use>
                </svg>
                <div class="name">方案 (60)</div>
                <div class="code-name">#linear-fangan55</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan56"></use>
                </svg>
                <div class="name">方案 (56)</div>
                <div class="code-name">#linear-fangan56</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan57"></use>
                </svg>
                <div class="name">方案 (61)</div>
                <div class="code-name">#linear-fangan57</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan58"></use>
                </svg>
                <div class="name">方案 (58)</div>
                <div class="code-name">#linear-fangan58</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan59"></use>
                </svg>
                <div class="name">方案 (59)</div>
                <div class="code-name">#linear-fangan59</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan60"></use>
                </svg>
                <div class="name">方案 (62)</div>
                <div class="code-name">#linear-fangan60</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan61"></use>
                </svg>
                <div class="name">方案 (63)</div>
                <div class="code-name">#linear-fangan61</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan62"></use>
                </svg>
                <div class="name">方案 (66)</div>
                <div class="code-name">#linear-fangan62</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan63"></use>
                </svg>
                <div class="name">方案 (65)</div>
                <div class="code-name">#linear-fangan63</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan64"></use>
                </svg>
                <div class="name">方案 (70)</div>
                <div class="code-name">#linear-fangan64</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan65"></use>
                </svg>
                <div class="name">方案 (67)</div>
                <div class="code-name">#linear-fangan65</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan66"></use>
                </svg>
                <div class="name">方案 (69)</div>
                <div class="code-name">#linear-fangan66</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan67"></use>
                </svg>
                <div class="name">方案 (64)</div>
                <div class="code-name">#linear-fangan67</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan68"></use>
                </svg>
                <div class="name">方案 (68)</div>
                <div class="code-name">#linear-fangan68</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan107"></use>
                </svg>
                <div class="name">方案 (72)</div>
                <div class="code-name">#linear-fangan107</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan69"></use>
                </svg>
                <div class="name">方案 (71)</div>
                <div class="code-name">#linear-fangan69</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan70"></use>
                </svg>
                <div class="name">方案 (75)</div>
                <div class="code-name">#linear-fangan70</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan71"></use>
                </svg>
                <div class="name">方案 (76)</div>
                <div class="code-name">#linear-fangan71</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan72"></use>
                </svg>
                <div class="name">方案 (73)</div>
                <div class="code-name">#linear-fangan72</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan73"></use>
                </svg>
                <div class="name">方案 (74)</div>
                <div class="code-name">#linear-fangan73</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan74"></use>
                </svg>
                <div class="name">方案 (78)</div>
                <div class="code-name">#linear-fangan74</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan75"></use>
                </svg>
                <div class="name">方案 (79)</div>
                <div class="code-name">#linear-fangan75</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan76"></use>
                </svg>
                <div class="name">方案 (77)</div>
                <div class="code-name">#linear-fangan76</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan77"></use>
                </svg>
                <div class="name">方案 (81)</div>
                <div class="code-name">#linear-fangan77</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan78"></use>
                </svg>
                <div class="name">方案 (84)</div>
                <div class="code-name">#linear-fangan78</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan79"></use>
                </svg>
                <div class="name">方案 (82)</div>
                <div class="code-name">#linear-fangan79</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan108"></use>
                </svg>
                <div class="name">方案 (85)</div>
                <div class="code-name">#linear-fangan108</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan80"></use>
                </svg>
                <div class="name">方案 (80)</div>
                <div class="code-name">#linear-fangan80</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan81"></use>
                </svg>
                <div class="name">方案 (87)</div>
                <div class="code-name">#linear-fangan81</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan82"></use>
                </svg>
                <div class="name">方案 (90)</div>
                <div class="code-name">#linear-fangan82</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan83"></use>
                </svg>
                <div class="name">方案 (86)</div>
                <div class="code-name">#linear-fangan83</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan84"></use>
                </svg>
                <div class="name">方案 (89)</div>
                <div class="code-name">#linear-fangan84</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan85"></use>
                </svg>
                <div class="name">方案 (88)</div>
                <div class="code-name">#linear-fangan85</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan86"></use>
                </svg>
                <div class="name">方案 (91)</div>
                <div class="code-name">#linear-fangan86</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan87"></use>
                </svg>
                <div class="name">方案 (96)</div>
                <div class="code-name">#linear-fangan87</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan88"></use>
                </svg>
                <div class="name">方案 (95)</div>
                <div class="code-name">#linear-fangan88</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan89"></use>
                </svg>
                <div class="name">方案 (93)</div>
                <div class="code-name">#linear-fangan89</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan90"></use>
                </svg>
                <div class="name">方案 (94)</div>
                <div class="code-name">#linear-fangan90</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan91"></use>
                </svg>
                <div class="name">方案 (99)</div>
                <div class="code-name">#linear-fangan91</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan92"></use>
                </svg>
                <div class="name">方案 (92)</div>
                <div class="code-name">#linear-fangan92</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan93"></use>
                </svg>
                <div class="name">方案 (97)</div>
                <div class="code-name">#linear-fangan93</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan94"></use>
                </svg>
                <div class="name">方案 (83)</div>
                <div class="code-name">#linear-fangan94</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan95"></use>
                </svg>
                <div class="name">方案 (98)</div>
                <div class="code-name">#linear-fangan95</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan96"></use>
                </svg>
                <div class="name">方案 (100)</div>
                <div class="code-name">#linear-fangan96</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan97"></use>
                </svg>
                <div class="name">方案 (102)</div>
                <div class="code-name">#linear-fangan97</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan98"></use>
                </svg>
                <div class="name">方案 (105)</div>
                <div class="code-name">#linear-fangan98</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan99"></use>
                </svg>
                <div class="name">方案 (106)</div>
                <div class="code-name">#linear-fangan99</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan100"></use>
                </svg>
                <div class="name">方案 (101)</div>
                <div class="code-name">#linear-fangan100</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan101"></use>
                </svg>
                <div class="name">方案 (104)</div>
                <div class="code-name">#linear-fangan101</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan102"></use>
                </svg>
                <div class="name">方案 (103)</div>
                <div class="code-name">#linear-fangan102</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan103"></use>
                </svg>
                <div class="name">方案106</div>
                <div class="code-name">#linear-fangan103</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan109"></use>
                </svg>
                <div class="name">方案107</div>
                <div class="code-name">#linear-fangan109</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan112"></use>
                </svg>
                <div class="name">方案105</div>
                <div class="code-name">#linear-fangan112</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan104"></use>
                </svg>
                <div class="name">方案108</div>
                <div class="code-name">#linear-fangan104</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan105"></use>
                </svg>
                <div class="name">方案109</div>
                <div class="code-name">#linear-fangan105</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-weixinshuangse"></use>
                </svg>
                <div class="name">微信双色</div>
                <div class="code-name">#linear-weixinshuangse</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-mingpianshuangse"></use>
                </svg>
                <div class="name">名片双色</div>
                <div class="code-name">#linear-mingpianshuangse</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-tiaoyanfangan"></use>
                </svg>
                <div class="name">调研方案</div>
                <div class="code-name">#linear-tiaoyanfangan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan110"></use>
                </svg>
                <div class="name">方案 (18)</div>
                <div class="code-name">#linear-fangan110</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-jiejuefangan"></use>
                </svg>
                <div class="name">解决方案</div>
                <div class="code-name">#linear-jiejuefangan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-ai"></use>
                </svg>
                <div class="name">TencentDB for DBbrain_数据库优化_智能运维 - 腾讯云</div>
                <div class="code-name">#linear-ai</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#linear-fangan111"></use>
                </svg>
                <div class="name">方案</div>
                <div class="code-name">#linear-fangan111</div>
            </li>
          
          </ul>
          <div class="article markdown">
          <h2 id="symbol-">Symbol 引用</h2>
          <hr>

          <p>这是一种全新的使用方式，应该说这才是未来的主流，也是平台目前推荐的用法。相关介绍可以参考这篇<a href="">文章</a>
            这种用法其实是做了一个 SVG 的集合，与另外两种相比具有如下特点：</p>
          <ul>
            <li>支持多色图标了，不再受单色限制。</li>
            <li>通过一些技巧，支持像字体那样，通过 <code>font-size</code>, <code>color</code> 来调整样式。</li>
            <li>兼容性较差，支持 IE9+，及现代浏览器。</li>
            <li>浏览器渲染 SVG 的性能一般，还不如 png。</li>
          </ul>
          <p>使用步骤如下：</p>
          <h3 id="-symbol-">第一步：引入项目下面生成的 symbol 代码：</h3>
<pre><code class="language-html">&lt;script src="./iconfont.js"&gt;&lt;/script&gt;
</code></pre>
          <h3 id="-css-">第二步：加入通用 CSS 代码（引入一次就行）：</h3>
<pre><code class="language-html">&lt;style&gt;
.icon {
  width: 1em;
  height: 1em;
  vertical-align: -0.15em;
  fill: currentColor;
  overflow: hidden;
}
&lt;/style&gt;
</code></pre>
          <h3 id="-">第三步：挑选相应图标并获取类名，应用于页面：</h3>
<pre><code class="language-html">&lt;svg class="icon" aria-hidden="true"&gt;
  &lt;use xlink:href="#icon-xxx"&gt;&lt;/use&gt;
&lt;/svg&gt;
</code></pre>
          </div>
      </div>

    </div>
  </div>
  <script>
  $(document).ready(function () {
      $('.tab-container .content:first').show()

      $('#tabs li').click(function (e) {
        var tabContent = $('.tab-container .content')
        var index = $(this).index()

        if ($(this).hasClass('active')) {
          return
        } else {
          $('#tabs li').removeClass('active')
          $(this).addClass('active')

          tabContent.hide().eq(index).fadeIn()
        }
      })
    })
  </script>
</body>
</html>
